import React from 'react';
import { Popconfirm, Tooltip } from 'antd';
import { CopyOutlined } from '@ant-design/icons';
import hcpUtils from '@/utils/hcpUtils';
const HcpTableTooltip = ({ label, showValue, copyValue, idValue, onClick, showCopy = false }) => {
    const copy = (copyTxt) => {
        const createInput = document.createElement('input');
        createInput.value = copyTxt;
        document.body.appendChild(createInput);
        createInput.select(); // 选择对象
        document.execCommand('Copy'); // 执行浏览器复制命令
        createInput.style.display = 'none';
        document.body.removeChild(createInput);
    };

    const ellipsis = {
        width: '100%',
        display: 'block',
        overflow: 'hidden',
        textOverflow: 'ellipsis',
        whiteSpace: 'nowrap',
    };
    const handleCopyClick = () => {
        hcpUtils.copyText(showValue);
    };
    return (
        <Popconfirm
            title={`${label}:${copyValue || '-'}`}
            okText="复制"
            // trigger={copyValue && copyValue !=="-" ? "hover" : ""}
            trigger=""
            onConfirm={() => {
                copy(copyValue);
            }}
        >
            {onClick ? (
                <div className="hcp__table__tooltip">
                    <a style={ellipsis} onClick={onClick} title={showValue}>
                        {showValue || '-'}
                    </a>
                    <p style={ellipsis} hidden={!idValue} title={idValue}>
                        {`${idValue}` || '-'}
                    </p>
                    {showCopy && <CopyOutlined onClick={handleCopyClick} />}
                </div>
            ) : (
                <div className="hcp__table__tooltip">
                    <p style={ellipsis} title={showValue}>
                        {showValue || '-'}
                    </p>
                    <p style={ellipsis} title={idValue} hidden={!idValue}>
                        {`${idValue}` || '-'}
                    </p>
                    {showCopy && <CopyOutlined onClick={handleCopyClick} />}
                </div>
            )}
        </Popconfirm>
    );
};

export default HcpTableTooltip;
